<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
        <meta name="author" content="Coderthemes">

        <link rel="shortcut icon" href="assets/images/favicon_1.ico">

        <title>Ubold - Responsive Admin Dashboard Template</title>

        <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="assets/css/icons.css" rel="stylesheet" type="text/css" />
        <link href="assets/css/style.css" rel="stylesheet" type="text/css" />

        <script src="assets/js/modernizr.min.js"></script>


    </head>


    <body class="fixed-left" id="do-nicescrol">
       
        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <div class="btn-group pull-right m-t-15">
                    <button type="button" class="btn btn-default dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-expanded="false">Settings</button>
                    <div class="dropdown-menu dropdown-menu-right" aria-labelledby="btnGroupDrop1">
                        <a class="dropdown-item" href="form-elements.html#">Dropdown One</a>
                        <a class="dropdown-item" href="form-elements.html#">Dropdown Two</a>
                        <a class="dropdown-item" href="form-elements.html#">Dropdown Three</a>
                        <a class="dropdown-item" href="form-elements.html#">Dropdown Four</a>
                    </div>
                </div>

                <h4 class="page-title">表单元素</h4>
                 <p class="text-muted page-title-alt">Welcome to Ubold admin panel !</p>

            </div>
        </div>


        <div class="row">
            <div class="col-12">
                <div class="card-box">
                    <h4 class="m-t-0 header-title"><b>Input Types</b></h4>
                    <p class="text-muted m-b-30 font-14">
                        最常见的表单控件，基于文本的输入字段。包括所有类型的HTML5支持: <code>text</code>, <code>password</code>, <code>datetime</code>, <code>datetime-local</code>, <code>date</code>, <code>month</code>, <code>time</code>, <code>week</code>, <code>number</code>, <code>email</code>, <code>url</code>, <code>search</code>, <code>tel</code>, and <code>color</code>.
                    </p>

                    <div class="row">
                        <div class="col-12">
                            <div class="p-20">
                                <form class="form-horizontal" role="form">
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">文本</label>
                                        <div class="col-10">
                                            <input type="text" class="form-control" value="Some text value...">
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label" for="example-email">电子邮件</label>
                                        <div class="col-10">
                                            <input type="email" id="example-email" name="example-email" class="form-control" placeholder="Email">
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">密码</label>
                                        <div class="col-10">
                                            <input type="password" class="form-control" value="password">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">静态控制</label>
                                        <div class="col-10">
                                            <input type="text" class="form-control" placeholder="placeholder">
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">帮助文本</label>
                                        <div class="col-10">
                                            <textarea class="form-control" rows="5"></textarea>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Readonly</label>
                                        <div class="col-10">
                                            <input type="text" class="form-control" readonly="" value="Readonly value">
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Disabled</label>
                                        <div class="col-10">
                                            <input type="text" class="form-control" disabled="" value="Disabled value">
                                        </div>
                                    </div>


                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Static control</label>
                                        <div class="col-10">
                                            <p class="form-control-static">email@example.com</p>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Helping text</label>
                                        <div class="col-10">
                                            <input type="text" class="form-control" placeholder="Helping text">
                                            <span class="help-block"><small>A block of help text that breaks onto a new line and may extend beyond one line.</small></span>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Input Select</label>
                                        <div class="col-10">
                                            <select class="form-control">
                                                <option>1</option>
                                                <option>2</option>
                                                <option>3</option>
                                                <option>4</option>
                                                <option>5</option>
                                            </select>
                                            <h6>Multiple select</h6>
                                            <select multiple class="form-control">
                                                <option>1</option>
                                                <option>2</option>
                                                <option>3</option>
                                                <option>4</option>
                                                <option>5</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Default file input</label>
                                        <div class="col-10">
                                            <input type="file" class="form-control">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Date</label>
                                        <div class="col-10">
                                            <input class="form-control" type="date" name="date">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Month</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="month" name="month">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Time</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="time" name="time">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Week</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="week" name="week">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Number</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="number" name="number">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">URL</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="url" name="url">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Search</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="search" name="search">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Tel</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="tel" name="tel">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Color</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="color" name="color">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-2 col-form-label">Range</label>
                                        <div class="col-md-10">
                                            <input class="form-control" type="range" name="range" min="0" max="10">
                                        </div>
                                    </div>

                                </form>
                            </div>
                        </div>

                    </div>
                    <!-- end row -->

                </div> <!-- end card-box -->
            </div><!-- end col -->
        </div>
        <!-- end row -->


        <div class="row">
            <div class="col-12">
                <div class="card-box">
                    <h4 class="m-t-0 header-title"><b>Input States</b></h4>
                    <p class="text-muted m-b-30 font-14">
                        Bootstrap includes validation styles for error, warning, and success states on form controls.
                    </p>

                    <div class="p-20">
                        <form class="form-horizontal" role="form">

                            <div class="form-group has-success">
                                <label class="form-control-label" for="inputSuccess1">Input with success</label>
                                <input type="text" class="form-control form-control-success" id="inputSuccess1">
                                <div class="form-control-feedback">Success! You've done it.</div>
                                <small class="form-text text-muted">Example help text that remains unchanged.</small>
                            </div>
                            <div class="form-group has-warning">
                                <label class="form-control-label" for="inputWarning1">Input with warning</label>
                                <input type="text" class="form-control form-control-warning" id="inputWarning1">
                                <div class="form-control-feedback">Shucks, check the formatting of that and try again.</div>
                                <small class="form-text text-muted">Example help text that remains unchanged.</small>
                            </div>
                            <div class="form-group has-danger">
                                <label class="form-control-label" for="inputDanger1">Input with danger</label>
                                <input type="text" class="form-control form-control-danger" id="inputDanger1">
                                <div class="form-control-feedback">Sorry, that username's taken. Try another?</div>
                                <small class="form-text text-muted">Example help text that remains unchanged.</small>
                            </div>

                        </form>
                    </div>

                </div> <!-- end card-box -->
            </div> <!-- end col -->
        </div>
        <!-- end row -->


        <div class="row">
            <div class="col-12">
                <div class="card-box">
                    <h4 class="m-t-0 header-title"><b>Input Sizes & Group</b></h4>
                    <p class="text-muted m-b-30 font-14">
                        Set heights using classes like <code>.input-lg</code>, and set widths using grid column classes like <code>.col-lg-*</code>.
                    </p>

                    <div class="p-20">
                        <form role="form" class="form-horizontal">
                            <div class="form-group row">
                                <label class="col-2 col-form-label" for="example-input-small">Small</label>
                                <div class="col-10">
                                    <input type="text" id="example-input-small" name="example-input-small" class="form-control input-sm" placeholder=".input-sm">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label" for="example-input-normal">Normal</label>
                                <div class="col-10">
                                    <input type="text" id="example-input-normal" name="example-input-normal" class="form-control" placeholder="Normal">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label" for="example-input-large">Large</label>
                                <div class="col-10">
                                    <input type="text" id="example-input-large" name="example-input-large" class="form-control input-lg" placeholder=".input-lg">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label">Grid Sizes</label>
                                <div class="col-10">
                                    <input type="text" class="form-control" placeholder=".col-sm-4">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label">Static</label>
                                <div class="col-4">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="fa fa-user"></i></span>
                                        <input type="text" id="example-input1-group1" name="example-input1-group1" class="form-control" placeholder="Username">
                                    </div>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label">Dropdowns</label>
                                <div class="col-10">
                                    <div class="input-group">
                                        <div class="input-group-btn">
                                            <button type="button" class="btn waves-effect waves-light btn-primary dropdown-toggle" data-toggle="dropdown" style="overflow: hidden; position: relative;">Action <span class="caret"></span></button>
                                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                                <a class="dropdown-item" href="form-elements.html#">Action</a>
                                                <a class="dropdown-item" href="form-elements.html#">Another action</a>
                                                <a class="dropdown-item" href="form-elements.html#">Something else here</a>
                                            </div>
                                        </div>
                                        <input type="text" id="example-input1-group3" name="example-input1-group3" class="form-control" placeholder="Username">
                                    </div>

                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-2 col-form-label">Buttons</label>
                                <div class="col-10">
                                    <div class="input-group">
                                        <input type="email" id="example-input2-group2" name="example-input2-group2" class="form-control" placeholder="Email">
                                    <span class="input-group-btn">
                                    <button type="button" class="btn waves-effect waves-light btn-primary">Submit</button>
                                    </span>
                                    </div>
                                </div>
                            </div>


                        </form>
                    </div>
                </div> <!-- end card-box -->
            </div> <!-- end col -->
        </div>
        <!-- end row -->

                    
        <script>
            var resizefunc = [];
        </script>

        <!-- jQuery  -->
        <script src="assets/js/jquery.min.js"></script>
        <script src="assets/js/popper.min.js"></script><!-- Popper for Bootstrap -->
        <script src="assets/js/bootstrap.min.js"></script>
        <script src="assets/js/detect.js"></script>
        <script src="assets/js/fastclick.js"></script>
        <script src="assets/js/jquery.slimscroll.js"></script>
        <script src="assets/js/jquery.blockUI.js"></script>
        <script src="assets/js/waves.js"></script>
        <script src="assets/js/wow.min.js"></script>
        <script src="assets/js/jquery.nicescroll.js"></script>
        <script src="assets/js/jquery.scrollTo.min.js"></script>

        <script src="assets/js/jquery.core.js"></script>
        <script src="assets/js/jquery.app.js"></script>

    </body>
</html>